<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@include file="/WEB-INF/base.jspf"%>
<style>
 #test1 {
	 margin: 2px;  
	 height: 37px;
}

#test2 {
	margin: 2px;
	height: 37px;
}

#qblx {
	margin: 2px;
	height: 37px;
}
	.modal-dialog {
		max-width: 1000px;
	}
#zflx {
	margin: 2px;
	height: 37px;
}

.layui-inline {
	height: 100px;
	margin-top:15px;
}

#hymc {
	margin: 2px;
	height: 45px;
}
.btn btn-default{
    margin-top:20px;
}
#table_id_example_paginate{
 margin-right:100px;
}
.class-input-pageNumber{
    
	width:40px;
	height:23px;
	position: absolute;
	right:550px;
	top:12px;
}
.class-span-searchBtn{
	height:24px;
	width:36px;
	font-size:14px;
	text-algin:center;
	line-height:25px;
	padding:0!important;
	position: absolute;
	right:500px;
	top:12px;
}
.dataTables_length{
	margin-top:12px;
	margin-left:50px;
}
.tableSearch{
    position: relative;
}
.hidden-c {
	display:none;
}

.btn-c-dealShenQing {
	display:none;
}
table th,table tr,table td {
	text-align: center;
	vertical-align:middle;
}
</style>
	<div class="layui-inline">
		<br> 
		<input type="text" id="hymc" placeholder="请输入会员名称"> 
		<button class="layui-btn layui-btn-radius" id="btn_search" >查询</button>
		<button class="layui-btn layui-btn-radius" id="button-i-resetTableContent" style="margin-left:5px;">重置</button>
	</div>
   <div>
	<table class="class-tableDataTable class-table-needClick display table table-striped table-bordered table-hover" id="hyjiakuan">
		<thead>
			<tr>
				<th>用户帐号</th>
				<th>用户昵称</th>
				<th>用户QQ</th>
				<th>账户余额</th>
				<th>返点金额</th>
				<th>注册时间</th>
				<th>最后登录时间</th>
				<th>最后登录地址</th>
				<th>金额操作</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
	<div class="modal fade" id="editModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">会员加款</h4>
					</div>
					<div class="modal-body">
								<input type="hidden" id="userid" value="">
								<p style="display:flex;align-items:center;"><span style="width:80px;display:inline-block;">会员账号:</span><input style="width:146px;" class="objcect form-control" id="name" value="" readonly></p>
					            <p style="display:flex;align-items:center;"><span style="width:80px;display:inline-block;">会员昵称:</span><input style="width:146px;" class="objcect form-control" id="nicheng" value="" readonly ></p>
								<p style="display:flex;align-items:center;"><span style="width:80px;display:inline-block;">账户余额:</span><input style="width:146px;" class="objcect form-control" id="balance" value="" readonly></p>
								<p style="display:flex;align-items:center;">
								<span style="width:80px;display:inline-block;">操作类型:</span>				
								<select  class="btn btn-default" id="type" style="height:34px;width:146px;">
									<option value="">请选择操作类型</option>
									<option value="人工加款">人工加款</option>
									<option value="人工扣款">人工扣款</option>
									<option value="活动赠送">活动赠送</option>
								</select>
								</p>
								<p style="display:flex;align-items:center;"><span style="width:80px;display:inline-block;">操作金额:</span><input style="width:146px;" class="form-control" type="text" id="fukuanje" placeholder="操作金额" ></p>
								<p style="display:flex;align-items:center;"><span style="width:80px;display:inline-block;">操作原因:</span><textarea class="form-control" id="beizhu" placeholder="操作原因" maxlength="50" style="resize: none;width:auto;flex-grow:1;" ></textarea></p>				
					</div>					
					<div class="modal-footer">
					<button type="button" id="closeBtn" class="btn btn-default" data-dismiss="modal">关闭
					</button>
					<button type="button" id="submitBtn" class="btn btn-primary">提交更改</button>
				</div>
			</div>
		</div>
	</div>	
</div>

<script>
var modal = $("#editModal");
modal.on("show.bs.modal", function(e) {    
    var btn = $(e.relatedTarget),
        id = btn.data("id");
    $("#userid").val(id);
    $("#name").val(btn.data("name"));
    $("#nicheng").val(btn.data("nicheng"));
    $("#balance").val(btn.data("balance"));
  });
  $('#submitBtn').click(function () {
	  	if($('#userid').val()==""){
  			alert('参数出错!');
			return false;
		}
	  	if($('#type').val()==""){
	  		alert('请选择操作类型!');
  			return false;
  		}
	  	if($('#fukuanje').val()=="" || isNaN($('#fukuanje').val())==true){
	  		alert('请输入正确的付款金额!');
  			return false;
  		}
	  	$.ajax({
            dataType: "text",
            type: "post",
            url:"/zhgl/addUserBalance.do",
            data: { 
            	"userid": $('#userid').val(),
            	'name':$('#name').val(), 
            	"type": $('#type').val(), 
            	"fukuanje": $('#fukuanje').val(),
            	"beizhu": $('#beizhu').val()
            	},
            success: function (data) {
            	$('#editModal').modal('hide');
            	var obj = jQuery.parseJSON(data);
            	alert(obj.data);
				var table = $('#hyjiakuan').DataTable();			
				table.ajax.url("/zhgl/findAllUserInfo.do").load();
            },
            error: function (data) {
                console.log('error');
            }
        });
   });
function dataTable01(){
	$("#hyjiakuan").DataTable({
      // "bPaginate": true,
      "bLengthChange": true,      
      "bSort": false,
      // "bInfo": true,
      "bAutoWidth": false,
//         "bServerSide":true,
      'aLengthMenu':[5,10, 20],
       "searching": true, 
       "dom": "t<'tableinfo'i<'tableSearch'p>l>",
       "language": {//语言设置  
            "lengthMenu": "每页显示 _MENU_ 条记录",     
            "zeroRecords": "没有检索到数据",     
            "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",     
            "info": "没有数据",     
            "oPaginate": {     
                "sFirst": "首页",     
                "sPrevious": "前一页",     
                "sNext": "后一页",     
                "sLast": "尾页"    
          	},
            "search":"搜索:",
            "infoFiltered":   "(从  _MAX_ 记录中搜索出结果)",
            "infoEmpty":      "没有找到匹配的信息",
         },
	         "columns": [
                     { "data": "name" },
                     { "data": "nicheng" },
                     { "data": "qq" },
                     { "data": "balance" },
                     { "data": "money" },
                     { "data": "createtime" },
                     { "data": "lastTime" },
                     { "data": "lastIp" },
                     {
                        "data": "id",
                        "orderable": false,
                        "width": "2%",
                        "render": function(data,type,row,meta){
                               return data = '<button class="btn btn-success" data-id=' + data 
                               + ' data-name=' + row.name + ' data-balance=' + row.balance + ' data-nicheng='
                               + row.nicheng + ' data-toggle="modal" data-target="#editModal">修改</button>';
                        }
                     }
                 ],	                    
	      "ajax": {
    	  	  "type": 'POST',
    	      "url":"/zhgl/findAllUserInfo.do", 
	    	  "data": function ( d ) {
	    	        d.name = $('#hymc').val();
	    	    },
	      },	       
    })
}
dataTable01();
insertSearchBtn()
document.querySelector("#btn_search").addEventListener("click", function(event) {
	var table = $('#hyjiakuan').DataTable();			
	table.ajax.url("/zhgl/findByNameUserInfo.do").load();
})	
$("#button-i-resetTableContent").on("click", function(event) {
	var table = $('#hyjiakuan').DataTable();			
	table.ajax.url("/zhgl/findAllUserInfo.do").load();
    $('#hymc').val("");
})
</script>
